<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
	<meta name="viewport" content="width=device-width, initial-scale=1">
  	<link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
  	<script type="text/javascript" src="./stitic/js/jquery-3.4.1.min.js"></script>
	<title>培训信息打印模板</title>
</head>
<style>
  header, footer {
	display: none;
}
	@media print {
	header {
		display: block;
	}
	footer {
		display: block;
	}
}
   body{
      font-size: 18px;
     /* background: silver;*/
    }
   .a4-endwise{
      width: 1075px;
      height: 1522.7px;
      overflow: hidden;
      padding: 0;
      word-break:break-all;
      background: white;
       margin: 30px; 
    }
  	input{
      border:0px;
      background-color: #FFFF;
      text-align: left;
      width: 70%;
    }
  .table_demo td{
     text-align:center;
     padding: 3px;
    height:10%;
  }
</style>
  <style media="print">
.NoPrint { DISPLAY: none }
</style>
<body>
  <header></header>
      <form id="trainData" text-align="center">
        <div style="width:100%;">
			<h1 style="text-align: center;margin-top: 5%;">
              <input type="text" name="traindata_name" field="traindata_name" 
				style="text-align: center;margin-top: 42px;" disabled>
			</h1>
        </div>
			  <div style="margin-left: 5%;;margin-top: 5px;float: none;padding: 10px;width:auto;">
                    <label>主办单位：</label>
				    <input type="text" name="company" field="company" disabled>
            </div>
             <div style="margin-left: 5%;;margin-top: 5px;float: none;padding: 10px;">
                <label>培训地点：</label>
                <input type="text" name="traindata_address" field="traindata_address" disabled>
            </div>
             <div style="margin-left: 5%;;margin-top: 5px;float: none;padding: 10px;">
                <label>培训级别：</label>
                <input type="text" name="level" field="level" disabled>
            </div>
            <div style="margin-left: 5%;;margin-top: 5px;float: none;padding: 10px;">
                <label>培训期数：</label>
                <input type="text" name="issue" field="issue" disabled>
            </div>
            <div style="margin-left: 5%;;margin-top: 5px;float: none;padding: 10px;">
                <label>开始时间：</label>
                <input type="text" name="start_time" field="start_time" disabled>
            </div>
            <div style="margin-left: 5%;;margin-top: 5px;float: none;padding: 10px;">
                <label>结束时间：</label>
                <input type="text" name="end_time" field="end_time" disabled>
            </div>
		</form>
      <p style="margin-left: 5%;margin-top: 5px;float: none;padding: 10px;">签到表：</p>
      <table border="1" align="center" class="table_demo" style=" width: 90%;">
        <thead>
            <tr>
                <td>姓 名</td>
                <td>学 校</td>
                <td>签 到</td>
            </tr>
         </thead>
       <tbody id="tableData" style="margin-top: 100px;"></tbody>  
         </table>
 
  	<footer></footer>

  	 <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  <script>
    function getQueryString(name) {
        var result = window.location.search.match(new RegExp("[\?\&]" + name + "=([^\&]+)", "i"))
        if(result == null || result.length < 0){
          return ""
        }
        return result[1]
    } 

    function pajax1(option){
      return new Promise(resolve => {
       $.ajax({
          ...option,
          success (data) {
            resolve(option.success(data))
          },
          error: function () {
            option.error()
          }
        })
      })
    }
    
    function pajax(option){
      return new Promise((resolve,reject) => {
       $.ajax({
          ...option,
          success (data) {
            resolve(data)
          },
          error: function (ex) {
            reject(ex)
          }
        })
      })
    }
    
    async function dealSch (value) {
      return pajax({
        url: '../../index.php/admin/Traindata/School',
        type: 'POST',
        data: {}
      }).then(data => data.data[value - 1].sch_name).catch(ex => alert("error!"));
    }
    
    function dheckTable(id){
      return pajax({
        url:"../../index.php/admin/Traindata/Checktable",
        type: 'POST',
        data: {id},
        success: function (data) {
          return data
        },
        error: function () {
          alear('error!')
        }
      })
    }
    

    (async function(){
    	var id = getQueryString('item')
      //console.log(id)
      //此接口是获取培训信息
      var data = await dheckTable(id)
      console.log(data)
      var people = data.data.train   //培训信息
      var trainData = data.data.traindata  //人员名单
      var field = $("#trainData [field]");
          field.each(function() {
             var value = trainData[$(this).attr("field")];
             $(this).val(value);
             })
      if(people.length < 1){
      	var item;
        item = '<tr><td colspan="3">无数据</td></tr>';
        $('#tableData').append(item); 
      }else{
        for(var i=0;i< people.length;i++){
          var schName = await dealSch(people[i].sch);
          var item = "<tr><td>" + people[i].name + "</td><td>" + schName +"</td><td></td></tr>";
          $('#tableData').append(item);          
        }
      }
    })()
  </script>
</body>
</html>
